//创建router文件夹，并创建index.js，这个index.js，就是我们创建好的路由器
//创建好后，导入我们安装好的vue-router,这里导入以下两个模块就够用了
import { createRouter, createWebHistory } from 'vue-router'

//导入组件
import LoginVue from '@/views/Login.vue';
import LayoutVue from '@/views/Layout.vue';

import ArticleCategoryVue from '@/views/article/ArticleCategory.vue'
import ArticleManageVue from '@/views/article/ArticleManage.vue'
import UserAvatarVue from '@/views/user/UserAvatar.vue'
import UserInfoVue from '@/views/user/UserInfo.vue'
import UserResetPasswordVue from '@/views/user/UserResetPassword.vue'
import MenuVue from '@/views/sys/Menu.vue'

//我们要做的是,定义访问的路径,以及该路径与组件的关系
//定义路由关系,定义的数组可以有多个js对象
const routes = [
    // 这里每个js对象，有两个属性
    { path: '/login', component: LoginVue },
    {
        // path定义访问的路径
        path: '/',
        //component定义访问当前路径后，展示的组件
        component: LayoutVue, 

        //redirect 重定向到指定页面
        redirect: '/article/manage', 

        //子路由：在已有的路由关系里声明一个children
        children: [
            { path: '/article/category', component: ArticleCategoryVue },
            { path: '/article/manage', component: ArticleManageVue },
            { path: '/user/info', component: UserInfoVue },
            { path: '/user/avatar', component: UserAvatarVue },
            { path: '/user/resetPassword', component: UserResetPasswordVue },
            { path: '/sys/menu', component: MenuVue }
        ]
    }
]

//用createRouter方法,来创建路由器
const router = createRouter({
    //传递一个路由模式，在vue里有两种路由模式，这里用的history模式
    //用上边导入的函数来指定这个history模式
    history: createWebHistory(),
    //刚才定义的路由关系传进来
    routes: routes
})

//路由器创建好后，导出路由
export default router